ReactのMain Concept:7. Conditional Rendering
https://reactjs.org/docs/conditional-rendering.html
Reactでは、Applicationのステートに基づいて、componentを独立してレンダリングできる
全部レンダリングしなくていい
Reactに条件付きでレンダリングさせたい場合、JSの演算子を使える
Element Variables
他の出力を変えずにcomponentの一部をレンダリングできる
https://codepen.io/gaearon/pen/QKzAgB?editors=0010
ログイン状態を持つstateful componentで返すエレメントを別にする例
JSXにおけるinlineの条件分岐はいくつか方法がある(次で説明する)
Inline If with Logical && Operator
ReactのMain Concept:2. Introducing JSX#5b93b1c33f4425000035b222のため、以下のように書ける
{statement && <el></el>}
Inline If-Else with Conditional Operator
{statement ? <el></el> : <el></el>} /vtuber/える.icon
Preventing Component from Rendering
他のコンポーネントによってレンダリングされたコンポーネントを隠したい/vtuber/月ノ美兎.iconときがある
nullを返せば良い
他のlifecycle methodの発火に影響しない
componentDidUpdateとかは呼ばれる